import request from '../../utils/request'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    videoGroupList:[],//视频数据
    navId:'',//下标Id
    videoList:[],//视频详情数据
    videoId:'',//记录上次的播放的视频id
    videoUpdateTime:[],
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    //获取视屏列表
    this.getVideoGroupList();
  },
  async getVideoGroupList() {
    let videoGroupListData = await request('/video/group/list')
    let videoListTemp = videoGroupListData.data.splice(0,14);
    this.setData({
      videoGroupList: videoListTemp,
      navId: videoListTemp[0].id
    })
    this.getVideoList(this.data.navId)
    //默认播放第一个视频
    wx
  },
  //激活下标 并且 获取视频详情
  async changeNav(event) {
    //切换导览后清空前面的导览的数据
    if(this.data.videoList){
      this.setData({
        videoList: []
      })
    }
    //1.id获取
    // let navId = event.currentTarget.id;
    // this.setData({
    //   navId: navId*1;
    // })
    //2.data-set获取 不需要转型
    // let navId =  event.currentTarget.dataset.id;
    // this.setData({
    //   navId   //data-set不会转型
    // })
    //3. 右移
    let navId = event.currentTarget.id;
    this.setData({
      navId: navId>>>0
    });
    //点击切换导航栏的弹窗
    wx.showLoading({
      title: '正在加载稍后',
    })

    this.getVideoList(this.data.navId)
  },
  //获取视频列表
  async getVideoList(id){
    let videoListData = await request('/video/group',{id});
    //隐藏加载显示页面
    if (videoListData) {
      wx.hideLoading();
    }
    let idx = 0;
    let videoList = videoListData.datas.map((item)=>{
      item.id = idx++;
      return item
    });
    console.log('获取视频详情: ',videoList)
    this.setData({
      videoList
    })
  },
  //点击播放/继续播放的回调
  handlePlay(event){
    /**
     * 需求：
     *  1.在点击播放的事件中需要找到上一个播放的视频
     *  2.在播放新的视频之前关闭上一个正在播放的视频
     * 关键：
     *  1.如何找到上一个视频的实例对象
     *  2.如何确认点击播放的视频和正在播放的视频不是同一个视频
     * JS单例模式：
     *  1.需要创建多对象的哈给场景下，通过一个变量接收，始终保持只有一个对象
     *  2.节省内存空间
     */
    let vId = event.currentTarget.id;//获取视频id

    //关闭上一个播放的视频
    //上次的视频vid不等现在点击的视频vid--> 视频不为空 --> 关闭上一个视频
    // this.vId !==vId && this.videoContext && this.videoContext.stop()
    // this.vId = vId; //保存视频id（表示上次的视频Id）
    // 更新data中videoId的状态数据
    this.setData({
      videoId: vId
    })
    this.videoContext = wx.createVideoContext(vId);//保存视频内容实例（表示上次的视频内容示例）
    let {videoUpdateTime} = this.data  // let videoUpdateTime = this.data.videoUpdateTime
    let videoItem = videoUpdateTime.find(i=>i.vid===vId);
    this.videoContext.seek(videoItem.currentTime);//找到上次播放的位置

    // this.videoContext.play()

    //继续播放到指定的位置

  },
  //记录播放时间
  handleTimeUpdate(event){
    console.log("视频播放的时长：",event)
    let videoTimeObj = {vid:event.currentTarget.id,currentTime: event.detail.currentTime}
    let {videoUpdateTime} = this.data;
    //判断是否已经记录过
    let videoItem = videoUpdateTime.find(item=>item.vid=== videoTimeObj.vid);
    if(videoItem){
      videoItem.currentTime = videoTimeObj.currentTime
    }else{
      videoUpdateTime.push(videoTimeObj)
    }
    this.setData({
      videoUpdateTime
    })

    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})